<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
        <link rel="stylesheet" href="../../gameStyle.css" type="text/css" />
        <script type="text/javascript" src="../../lib/ivank.js"></script>
        <script type="text/javascript" src="../../lib/jquery-latest.js"></script>
        <script type="text/javascript" src="../types.js"></script>
        <script type="text/javascript" src="../button.js"></script>
        <script type="text/javascript" src="../timer.js"></script>
        <script type="text/javascript" src="../menu.js"></script>
        <script type="text/javascript" src="../nextlevelMenu.js"></script>
        <script type="text/javascript" src="../level.js"></script>
    </head>
    <body onload="Start();">

        <canvas id ="canvas" width="740" height="500"></canvas>
        <script>         
            var currentLevel = 1;
            var canvas = document.getElementById("canvas");
            var cwidth = canvas.getAttribute("width");
            var cheight = canvas.getAttribute("height");
            var mamOznaceneObr = false;
            var oznacenyObr = null;
            var mamOznaceneAt = false;
            var oznacenyAt = null;
            var obrpolicka;
            var atpolicka;
            var counter = 20;

           
            
            function Start(){
                var stage = new Stage("canvas");
                var level = new ElementsLevel(4, typePhysics);
                level.init();
                stage.addChild(level,0);                 
                intervalID = window.setInterval(level.run, 1000 / 60);  
            }
            
            
            
            
            function ElementsLevel(name, level, type){
                Sprite.apply(this);
                Level.apply(this);
                this.name = name;
                this.level = level;
                this.type = type;
                this.canvas = canvas;
                
                this.init = init;
                function init(){
                    atpolicka = new AtomyPolicka(25,30);
                    atpolicka.init();
                    atpolicka.miesanie();
                    this.addChild(atpolicka);
                    this.graphics.lineStyle(5,black);
                    this.graphics.moveTo(cwidth/2, 30);
                    this.graphics.lineTo(cwidth/2, cheight -30);
                    obrpolicka = new obrPolicka(cwidth/2 +20, 30);
                    obrpolicka.init();
                    obrpolicka.miesanie();
                    this.addChild(obrpolicka);
                }
            }
            ElementsLevel.prototype = new Sprite();
                 
            function overDvojicu (target){
                console.debug(target.parent);// target.parent);
                if (mamOznaceneAt && mamOznaceneObr){
                    if (oznacenyObr.poradie == oznacenyAt.poradie){
                        //console.debug(obrpolicka);
                        obrpolicka.removeChild(oznacenyObr);
                        atpolicka.removeChild(oznacenyAt);
                        mamOznaceneObr = false;
                        oznacenyObr = null;
                        mamOznaceneAt = false;
                        oznacenyObr = null;
                        //console.debug("hura mas dvojicu");
                        counter--;
                    } else{
                        console.debug("smutne");
                        console.debug("obr "+ oznacenyObr.poradie);
                        console.debug("at "+ oznacenyAt.poradie);
                    }
                }
                if (counter == 0){
                    target.parent.levelSolved();
                }    
            }
            
            
            function obrPolicka(x,y){
                Sprite.apply(this);
                this.x = x;
                this.y = y;
                this.obrpolArray = Array (4);
               
                this.init = init;
                function init (){
                    for(var i = 0; i < 4; i++){
                        var array = new Array(5);  
                        for (var j = 0; j < 5; j++){
                            var obr = new Obrazok(i, j);
                            array[j] = obr;
                            this.addChild(array[j]);
                        }
                        this.obrpolArray[i] = array;
                    }
                }
                
                this.vloz = vloz;
                function vloz(obb,i,j){  
                    obb.setIJ(i, j);
                    obb.oznacene = false;
                    this.obrpolArray[i][j] = obb; 
                }
                
                this.miesanie = miesanie; 
                function miesanie(){
                    for(var i = 0; i < 4; i++){  
                        for (var j = 0; j < 5; j++){
                            var randomI = Math.floor((Math.random()*4));
                            var randomJ = Math.floor((Math.random()*5));
                            var pom =  this.obrpolArray[i][j];
                            this.vloz(this.obrpolArray[randomI][randomJ],i,j);
                            this.vloz(pom,randomI,randomJ);
                        }
                    }
                }
           }
            obrPolicka.prototype = new Sprite ();
            
            function Obrazok (i,j){
                Sprite.apply(this);
                this.poradie = i*5+j;
                this.oznacene = false;
                this.buttonMode = true;
               
                const IMAGE_URL= "pictures/ob/"+this.poradie+".jpg";
                var bitmapData = new BitmapData(IMAGE_URL);
                this.bitmap = new Bitmap(bitmapData);
                this.bitmap.x = 0;
                this.bitmap.y = 0;
                this.bitmap.alpha = 1;        
                this.buttonMode = true;
                this.mouseChildren=false;
                this.addChild(this.bitmap); 
                
                
                this.setIJ = function(i,j){
                    this.x = i*85;
                    this.y = j*85+10;
                    this.i = i;
                    this.j = j;
                }
                this.setIJ(i,j);
        
                this.down = down;
                function down(e){
                    if (mamOznaceneObr){ 
                        if (e.target.oznacene){
                            e.target.oznacene = false;
                            e.target.alpha = 1;
                            mamOznaceneObr = false;
                            oznacenyObr = null;
                            console.debug("if");
                        } else { //mam vybrate v obr ale klikla som na iny ako je vybraty
                            oznacenyObr.alpha = 1;
                            oznacenyObr.oznacene = false;
                            e.target.oznacene = true;
                            e.target.alpha = 0.3;
                            oznacenyObr = e.target;
                            console.debug("obr "+ e.target.poradie);
                            overDvojicu(e.target.parent);
                        }
                    } else {//nemam oznacene nic v poli obrazkov
                        e.target.oznacene = true;
                        e.target.alpha = 0.3;
                        mamOznaceneObr = true;
                        oznacenyObr = e.target;
                        console.debug("obr "+e.target.poradie);
                        overDvojicu(e.target.parent);
                    }
                }
                this.addEventListener(MouseEvent.MOUSE_DOWN, this.down);
            }
            Obrazok.prototype = new Sprite (); 
           
            function AtomyPolicka(x,y){
                Sprite.apply(this);
                this.x = x;
                this.y = y;
                this.atompolickaArray = Array (4);
                
                this.init = init;
                function init (){
                    for(var i = 0; i < 4; i++){
                        var array = new Array(5);  
                        for (var j = 0; j < 5; j++){
                            var obr = new Atom(i, j);
                            array[j] = obr;
//                            array[j].init();
                            this.addChild(array[j]);
                        }
                        this.atompolickaArray[i] = array;
                    }
                }
                    
                this.vloz = vloz;
                function vloz(att,i,j){  
                    att.setIJ(i, j);
                    att.oznacene = false;
                    this.atompolickaArray[i][j] = att; 
                }
                
                this.miesanie = miesanie; 
                function miesanie(){
                    for(var i = 0; i < 4; i++){  
                        for (var j = 0; j < 5; j++){
                            var randomI = Math.floor((Math.random()*4));
                            var randomJ = Math.floor((Math.random()*5));
                            var pom =  this.atompolickaArray[i][j];
                            this.vloz(this.atompolickaArray[randomI][randomJ],i,j);
                            this.vloz(pom,randomI,randomJ);
                        }
                    }
                }
            }
            AtomyPolicka.prototype = new Sprite();
           
            function Atom (i,j){
                Sprite.apply(this);
                this.poradie = i*5+j;
                this.oznacene = false;
                this.buttonMode = true;
                
                const IMAGE_URL= "pictures/at/"+this.poradie+".png";
                var bitmapData = new BitmapData(IMAGE_URL);
                this.bitmap = new Bitmap(bitmapData);
                this.bitmap.x = 0;
                this.bitmap.y = 0;
                this.bitmap.alpha = 1;        
                this.buttonMode = true;
                this.mouseChildren=false;
                this.addChild(this.bitmap); 
              
                this.setIJ = function(i,j){
                    this.x = i*85;
                    this.y = j*85+10;
                    this.i = i;
                    this.j = j;
                }
                this.setIJ(i,j);
               
                this.down = down;
                function down(e){
                    if (mamOznaceneAt){ 
                        if (e.target.oznacene){
                            e.target.oznacene = false;
                            e.target.alpha = 1;
                            mamOznaceneAt = false;
                            oznacenyAt = null;
                            console.debug("if");
                        } else { //mam vybrate v obr ale klikla som na iny ako je vybraty
                            oznacenyAt.alpha = 1;
                            oznacenyAt.oznacene = false;
                            e.target.oznacene = true;
                            e.target.alpha = 0.3;
                            oznacenyAt = e.target;
                            console.debug("at "+e.target.poradie);
                            overDvojicu(e.target.parent);
                        }
                    } else {//nemam oznacene nic v poli obrazkov
                        e.target.oznacene = true;
                        e.target.alpha = 0.3;
                        mamOznaceneAt = true;
                        oznacenyAt = e.target;
                        console.debug("at "+e.target.poradie);
                        overDvojicu(e.target.parent);
                    }
                }
                this.addEventListener(MouseEvent.MOUSE_DOWN, this.down);
                
   
            }
            Atom.prototype = new Sprite();
          
        </script>
    </body>
</html>